<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/top.css">
    <link rel="stylesheet" href="./css/footer.css">
    <link rel="stylesheet" href="./css/product_details.css">
    <!-- 轮播图样式 -->
    <script src="./js/jquery.min.js"></script>
    <script src="./js/product_details.js"></script>
</head>

<body>
    <!-- 页眉区域 -->
    <div class="head">
        <div class="wrapper">
            <h2 class="fl">legochina.cn</h2>
            <span class="fr">欢迎光临 <a href="#">乐购</a> ，请 登陆\ <a href="./login.html">注册</a> </span>
        </div>
    </div>
    <!-- 页眉结束 -->

    <!-- 导航栏区域 -->
    <div class="nav wrapper">
        <h1><img src="./imgs/logo.png" alt=""></h1>
        <div class="top wrapper clearfix">
            <form action="#" class="fl">
                <input type="text" placeholder="创意玩具">
                <input type="submit" value="">
            </form>
            <div class="fr">
                <a href="shopping_cart.html" target="_blank">
                    <i></i>
                    <span>购物车</span>
                    <span id="quantity">3</span>
                </a>
                <a href="#">
                    我的订单
                </a>
            </div>
        </div>
        <ul>
            <li><a href="#">图书</a></li>
            <li><a href="#">电子书</a></li>
            <li><a href="#">原创文学</a></li>
            <li><a href="#">服装</a></li>
            <li><a href="#">户外运动</a></li>
            <li><a href="#">孕婴童</a></li>
            <li><a href="#">家居</a></li>
            <li><a href="#">创意玩具</a></li>
            <li><a href="#">地方特产</a></li>
            <li><a href="#">海外购</a></li>
            <li><a href="#">电器城</a></li>
        </ul>
    </div>
    <!-- 导航栏接结束 -->

    <!-- 内容第一部分 -->
    <div class="content1 wrapper">
        <h3>图书 <span>> 小说 > 情感/家庭/婚姻 > 博集天卷 > 她和他</span></h3>
        <div class="buttom clearfix">
            <div class="left fl"></div>
            <div class="right fl">
                <h4>她和他</h4>
                <span class="red">《偷影子的人》作者马克·李维重磅新作，法国连续60周在榜，销量突破120万册</span>
                <p>[法] 马克·李维 著；杨亦雨 译</p>
                <div class="center">
                    <p>乐 购 价：<span>￥26.20</span> [6.9折] [定价 ：<i>￥38.00</i> ] (降价通知)</p>
                    <p>促销信息：<span>满减 每满150.00元，可减50.00元现金</span> 详情 >></p>
                    <p>领券:</p>
                    <span></span>
                    <span></span>
                </div>
                <div class="center_buttom">
                    <p>种类选择:
                        <span>平板装</span>
                        <span>精装板</span>
                    </p>
                </div>
                <div id="shopping_cart">
                    <span>
                        <input type="text" value="1">
                        <button id="details_jia">+</button>
                        <button id="details_jian">-</button>
                    </span>
                    <div id="shopping_cart1">
                        加入购物车
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 内容第二部分 -->
    <div class="content2 wrapper clearfix">
        <h3><span>人气单品</span></h3>
        <ul>
            <li>
                <img src="./imgs/003.jpg" alt="">
                <em></em>
                <p class="p1">白夜行&emsp;东野上吾</p>
                <span>推荐:💛🧡🧡💘💗💖</span>
                <br>
                <span>￥:38 <i>￥:58</i></span>
            </li>
            <li>
                <img src="./imgs/003.jpg" alt="">
                <em></em>
                <p class="p1">白夜行&emsp;东野上吾</p>
                <span>推荐:💛🧡🧡💘💗💖</span>
                <br>
                <span>￥:38 <i>￥:58</i></span>
            </li>
            <li>
                <img src="./imgs/003.jpg" alt="">
                <em></em>
                <p class="p1">白夜行&emsp;东野上吾</p>
                <span>推荐:💛🧡🧡💘💗💖</span>
                <br>
                <span>￥:38 <i>￥:58</i></span>
            </li>
            <li>
                <img src="./imgs/003.jpg" alt="">
                <em></em>
                <p class="p1">白夜行&emsp;东野上吾</p>
                <span>推荐:💛🧡🧡💘💗💖</span>
                <br>
                <span>￥:38 <i>￥:58</i></span>
            </li>
            <li>
                <img src="./imgs/003.jpg" alt="">
                <em></em>
                <p class="p1">白夜行&emsp;东野上吾</p>
                <span>推荐:💛🧡🧡💘💗💖</span>
                <br>
                <span>￥:38 <i>￥:58</i></span>
            </li>
        </ul>
    </div>

    <!-- 第三内容部分 -->
    <div class="content3 wrapper clearfix">
        <div class="left content2 fl">
            <h4>看了又看</h4>
            <ul class="clearfix">
                <li>
                    <img src="./imgs/003.jpg" alt="">
                    <em></em>
                    <p class="p1">白夜行&emsp;东野上吾</p>
                    <span>推荐:💛🧡🧡💘💗💖</span>
                    <br>
                    <span>￥:38 <i>￥:58</i></span>
                </li>
                <li>
                    <img src="./imgs/003.jpg" alt="">
                    <em></em>
                    <p class="p1">白夜行&emsp;东野上吾</p>
                    <span>推荐:💛🧡🧡💘💗💖</span>
                    <br>
                    <span>￥:38 <i>￥:58</i></span>
                </li>
                <li>
                    <img src="./imgs/003.jpg" alt="">
                    <em></em>
                    <p class="p1">白夜行&emsp;东野上吾</p>
                    <span>推荐:💛🧡🧡💘💗💖</span>
                    <br>
                    <span>￥:38 <i>￥:58</i></span>
                </li>
                <li>
                    <img src="./imgs/003.jpg" alt="">
                    <em></em>
                    <p class="p1">白夜行&emsp;东野上吾</p>
                    <span>推荐:💛🧡🧡💘💗💖</span>
                    <br>
                    <span>￥:38 <i>￥:58</i></span>
                </li>
                <li>
                    <img src="./imgs/003.jpg" alt="">
                    <em></em>
                    <p class="p1">白夜行&emsp;东野上吾</p>
                    <span>推荐:💛🧡🧡💘💗💖</span>
                    <br>
                    <span>￥:38 <i>￥:58</i></span>
                </li>
                <li>
                    <img src="./imgs/003.jpg" alt="">
                    <em></em>
                    <p class="p1">白夜行&emsp;东野上吾</p>
                    <span>推荐:💛🧡🧡💘💗💖</span>
                    <br>
                    <span>￥:38 <i>￥:58</i></span>
                </li>
                <li>
                    <img src="./imgs/003.jpg" alt="">
                    <em></em>
                    <p class="p1">白夜行&emsp;东野上吾</p>
                    <span>推荐:💛🧡🧡💘💗💖</span>
                    <br>
                    <span>￥:38 <i>￥:58</i></span>
                </li>
            </ul>
        </div>
        <div class="right fl">
            <h3>商品介绍 <span>(评价9999+)</span></h3>
            <img src="./imgs/评价.png" alt="">
            <ul>
                <img src="./imgs/评论.png" alt="">
            </ul>
        </div>
    </div>

    <div class="content4 wrapper">
        <!-- 魔兽广告 -->
        <div class="ms_advertising"></div>
    </div>




    <!-- 页脚区域 -->
    <div class="footer">
        <div class="top">
            <div class="wrapper">
                <ul>
                    <li><img src="./imgs/222_11.png" alt=""></li>
                    <li><img src="./imgs/222_13(1).png" alt=""></li>
                    <li><img src="./imgs/222_15.png" alt=""></li>
                    <li><img src="./imgs/222_17.png" alt=""></li>
                </ul>
            </div>
        </div>
        <div class="wrapper box1">
            <div class="buttom">
                <ul>
                    <li><a href="#">购物指南</a></li>
                    <li><a href="#">购物流程</a></li>
                    <li><a href="#">发票制度</a></li>
                    <li><a href="#">账户管理</a></li>
                    <li><a href="#">会员优惠</a></li>
                </ul>
                <ul>
                    <li><a href="#">支付方式</a></li>
                    <li><a href="#">货到付款</a></li>
                    <li><a href="#">网上支付</a></li>
                    <li><a href="#">礼品卡支付</a></li>
                    <li><a href="#">银行转帐</a></li>
                </ul>
                <ul>
                    <li><a href="#">订单服务</a></li>
                    <li><a href="#">订单配送查询</a></li>
                    <li><a href="#">订单状态说明</a></li>
                    <li><a href="#">自助取消订单</a></li>
                    <li><a href="#">自助修改订单</a></li>
                </ul>
                <ul>
                    <li><a href="#">退换货</a></li>
                    <li><a href="#">退换货政策</a></li>
                    <li><a href="#">自助申请退换货</a></li>
                    <li><a href="#">退换货进度查询</a></li>
                    <li><a href="#">退款方式和时间</a></li>
                </ul>
                <ul>
                    <li><a href="#">商家服务</a></li>
                    <li><a href="#">商家中心</a></li>
                    <li><a href="#">运营服务</a></li>
                    <li><a href="#">加入尾品汇</a></li>
                </ul>
                <img src="./imgs/logo_00.png" alt="" class="fl">
            </div>
            <p>
                公司简介 | Investor Relations | 网站联盟 | 乐购招商 | 机构销售 | 手机乐购 | 官方Blog | 热词搜索
            </p>
            <p>Copyright (C) 乐购网 2004-2016, All Rights Reserved</p>
        </div>
        <!-- 返回顶部 -->
        <div class="getback"></div>
    </div>